<style type="text/css">
	.btn-list {
		position: fixed;
		right: 40px;
	}
	.div-flex {
		display: flex
	}
	.div-flex .form-group {
		margin-right: 50px;
		text-align: center;
		line-height: 25px;
		margin-bottom: 0;
	}
	.tab-pane {
		border: 1px solid #F6F6F6;
	}
	.i-color {
		font-size: 34px;margin-right: 10px;color: #86C3FF;
	}
	.thumbnail {
		display: flow-root;
		width: max-content;
	}
	.thumbnail img {
		width: 50px;
		float: left;
		padding: 5px;
	}
</style>
<div class="panel panel-default panel-intro">
	<input type="hidden" name="ids" id="ids" value="{$ids}"/>
	<div class="div-flex">
		<i class="fa fa-reorder i-color"></i>
		<div style="line-height: 35px"><b>{$row.title}</div>
	</div>
	<div class="div-flex" style="margin-top: 20px">
		<div class="form-group">
			<span class="text-muted">报销人</span>
			<p>{$row.staff.name}</p>
		</div>
		<div class="form-group">
			<span class="text-muted">消费日期</span>
			<p>{$row.submit_date}</p>
		</div>
		<div class="form-group">
			<span class="text-muted">报销金额</span>
			<p>{$row.money}</p>
		</div>
		<div class="form-group">
			<span class="text-muted">审核状态</span>
			<p>{$row.check_status_text}</p>
		</div>
	</div>
	<div>

		<ul class="nav nav-tabs" role="tablist">
			<li role="presentation" class="active"><a href="#basic" aria-controls="home" role="tab" data-toggle="tab">报销明细</a></li>
			<li role="presentation"><a href="#cost" aria-controls="profile" role="tab" data-toggle="tab">审核流程</a></li>
		</ul>

		<div class="tab-content" style="overflow-y: scroll;height:565px">
			<div role="tabpanel" class="tab-pane fade panel-body form-horizontal active in" id="basic">

				<div class="form-group">

					<div class="col-xs-6 col-sm-10">
						<div class="form-group col-sm-10">
							<span class="text-muted">报销备注:</span>
							{$row.remark}
						</div>
					</div>

				</div>
				<div class="form-group">
					<div class="alert alert-warning-light no-margin">
						费用明细
					</div>
				</div>
				<div class="form-group">
					{foreach name="row.detail" item="val"}
					{if condition="$val['consume_type'] == '交通费'"}
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">报销类型:</span>
							{$val.consume_type}
						</div>
					</div>
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">报销金额:</span>
							{$val.consume_money}
						</div>
					</div>
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">消费日期:</span>
							{$val.consume_date}
						</div>
					</div>
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">交通工具:</span>
							{$val.car_type}
						</div>
					</div>
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">车牌号:</span>
							{$val.car_number}
						</div>
					</div>
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">公里数:</span>
							{$val.mileage}
						</div>
					</div>
					<div class="col-xs-6 col-sm-10">
						<div class="form-group col-sm-10">
							<span class="text-muted">备注:</span>
							{$val.remark}
						</div>
					</div>
					{present name="val.imgList"}
					<div class="col-xs-12 col-sm-10">
						<span class="text-muted">报销凭证:</span>
						{foreach name="val.imgList" item="value" }
						<img src="{$value.url}" data-tips-image style="margin-left: 10px;width:100px;height: 100px;" class="">
						{/foreach}
					</div>
					{/present}
					{else/}
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">报销类型:</span>
							{$val.consume_type}
						</div>
					</div>
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">报销金额:</span>
							{$val.consume_money}
						</div>
					</div>
					<div class="col-xs-6 col-sm-5">
						<div class="form-group col-sm-5">
							<span class="text-muted">消费日期:</span>
							{$val.consume_date}
						</div>
					</div>
					<div class="col-xs-6 col-sm-10">
						<div class="form-group col-sm-10">
							<span class="text-muted">备注:</span>
							{$val.remark}
						</div>
					</div>
					{present name="val.imgList"}
					<div class="col-xs-12 col-sm-10">
						<span class="text-muted">报销凭证:</span>
						{foreach name="val.imgList" item="value" }
						<img src="{$value.url}" data-tips-image style="margin-left: 10px;width:100px;height: 100px;" class="">
						{/foreach}
					</div>
					{/present}
					{/if}
					{/foreach}
				</div>

			</div>
			<div role="tabpanel" class="tab-pane fade panel-body form-horizontal" id="cost">
				{empty name="operations"}
				<div class="center-block">
					暂无相关数据!
				</div>

				{else/}
				{foreach name="operations" item="val" }
					<div class="div-record">
						<div class="div-flex">
							<i class="fa fa-user-circle-o i-color"></i>
							<div><b>{$val.check_staff.name}</b>
								<p class="text-muted">{$val.check_time}<br/></p></div>
						</div>
						<div class="well">
							审批状态: {$val.status_text}<br/>
							审批意见: {$val.content}<br/>
						</div>
					</div>
				{/foreach}
				{/empty}
			</div>

		</div>

	</div>
</div>